<template>
	<view class="global-websocket-notice">
		<view v-if="registerWSData.length > 0 && showDialog ">
			 <RegisterSucess :show="true" :info="registerWSData[0].regInfo" @onOk="() => closeDialog(registerWSData[0].data.id)" @onClose="closeDialog(registerWSData[0].data.id)" />
		</view>
	</view>
</template>

<script setup lang="ts">
	import {ref, onMounted, computed, toRaw, watchEffect, watch  } from 'vue'
	import {onShow} from "@dcloudio/uni-app"
	// import {useWebSocket } from '@/hooks/useSocket'
	import DialogSuccess from '@/components/customDialog/exchangeSuccess.vue'
	import DialogError from '@/components/customDialog/exchangeError.vue'
	import RegisterSucess from '@/components/customDialog/registerSuccess.vue'
	import { urlHelp } from '@/utils/index'
	import { useVipStore} from "@/stores/useVip.js"
	import ws from "@/utils/ws.js"
	// 导入 storeToRefs 用于解构响应式状态
	import { storeToRefs } from 'pinia';
	
	
	// import { socketData } from './mock.js'
	// import  {onSocketMessage, setupWebSocket, sendSocketMessage} from "@/utils/socket.js"
	const vipStore = useVipStore()
	
	const { wsData } = storeToRefs(vipStore);
	
	// 使用 watchEffect 监听
	watch(wsData, (n,o) => {
	    console.log('监听vip数据:', n, o);
	});
	
	
	// 既要从websoket中删掉，也要从pinia中删掉
	const sendMsg = (id) => {
		const sendData = {
			type: 10,
			data: {
				id
			}
		}
		ws.sendMessage(sendData); // 发送给服务端，服务端下次就不会再推这条信息了
		vipStore.removeRewardItem(id)
	}
	
	
	// const { onSocketMessage, sendSocketMessage  } = useWebSocket()
	
	const registerWSData = computed(() => vipStore.wsData.reward)
	
	// const sendSocketMessage = ws.sendMessage
	
	
	// onMounted(() => {
	// 	setupWebSocket()
	// })
	
	// const regInfo = ref({
	// 	title:"提示",
	// 	friend:"150***111",
	// 	worth:"1元的2天vip会员和10积分",
	// 	okTxt: '领取VIP到奖池',
	// 	href: null,
	// 	isFirst: false
	// })
	const showDialog = ref(false)
	const closeDialog = (id) => {
		showDialog.value = false;
		vipStore.removeRewardItem(id)
		// const copyInfoList = toRaw(infoList.value);
		// console.log('close', id, copyInfoList)
		// const newInfoList = [];
		// copyInfoList?.forEach(item => {
		// 	if(item?.data?.id !== id){
		// 		newInfoList.push(item)
		// 	}
		// });
		// console.log("newInfoList", id, newInfoList)
		// infoList.value = newInfoList
		console.log('是否还有数据', vipStore.wsData.reward)
		setTimeout(() => {
			showDialog.value = vipStore.haveData()
		}, 500)
	}
	
	const infoList = ref([])
	// 如果操作类型是奖励，调用这个方法
	const onreward = (data) =>{
		console.log("是否会走多次onreward", data, data.id, infoList.value.length, infoList.value)
		const content = JSON.parse(data.content)
		const ID = data.id
		// const isRepeat = () => {
		// 	return infoList.value.some(item => item.data.id === ID)
		// }
		if(data && !vipStore.isExistReward(ID)){
			const first = (v) => v?.isFirst && typeof v?.isFirst == 'string'
			// const sendData = {
			// 	type: 10,
			// 	data: {
			// 		id: data.id
			// 	}
			// }
			const info = {
				data: data, 
				visible: true,
				regInfo: {
					title:content.title,
					friend:content.friend,
					worth: content.worth,
					okTxt: '领取VIP到奖池',
					href: '/pagesD/jackpot/index',
					isFirst: first(data) ? content.isFirst : false,
					cb: () => sendMsg(data.id)
				}
			}	
			vipStore.addRewardItem(info)
			// infoList.value.push(info)
			// regInfo.value = info
			// registerShow.value = true;
		}
		console.log('是否有值----->', vipStore.haveData())
		showDialog.value = vipStore.haveData();
	}
	
	const isxiaomInit = ref(false) ;// true：不需要再次弹出小米视频 false: 还没弹过，需要弹
	const isHuaweiInit = ref(false) // true：不需要再次弹出华为视频 false: 还没弹过，需要弹
	
	// 绑定设备
	const bindDeviceVideo = async (data) => {
		if(data){
			const isXiaomi =  ["Xiaomi", "Redmi", 'xiaomi'];
			const isHuawie = ["HONOR"];
			const queryContent = () => {
				if(data.operateType === 35){
					return `孩子端手机为${data.content},是否观看视频教程`
				}
				if(data.operateType === 36){
					return `孩子端手机为${data.content},是否观看视频教程`
				}
			}
			const pushServerOver = () => { // 告诉服务接受到这条消息了，下次就不会再推送这条消息了
				// const sendData = {
				// 	type: 10,
				// 	data: {
				// 		id: data.id
				// 	}
				// }
				sendMsg(data.id) // 下次不会再推送这条消息了
			}
			const jump = (url: string) => {
				uni.showModal({
					title: data.title,
					content: queryContent(),
					confirmText:"观看教程",
					cancelText:"取消",
					success(res) {
						if (res.confirm) {
							pushServerOver(); 
							uni.navigateTo({
								url
							})
						} else if (res.cancel) {
							pushServerOver(); 
							console.log('用户点击取消');
						}
					}	
				})
			}
			
			if(data.operateType === 35){ // 绑定设备--孩子端下载 如果是“小米”，那么需要跳转到小米视频播放的页面
				if(isXiaomi.includes(data.content) && !isxiaomInit.value){
					jump('/pagesD/xiaomivideo/index')
					isxiaomInit.value = true
				} else {
					isxiaomInit.value = true
					pushServerOver()
				}
			}
			if(data.operateType === 36){ // 孩子端登录， 孩子端扫描绑定， 如果是“华为荣耀” 需要跳转到华为视频播放页面
				if(isHuawie.includes(data.content) && !isHuaweiInit.value) {
					jump('/pagesD/huaweivideo/index')
					isHuaweiInit.value = true
				} else {
					isHuaweiInit.value = true
					pushServerOver()
				}
			}
		}
	}
		
	// operateType 为 35和36 时，只有设备绑定页面才会弹窗，其它页面不弹框
	const isCurrentPage = (route = '') => {
		const pages = getCurrentPages();
		const currentPage = pages[pages.length - 1];
		console.log('currentPage',currentPage.route)
		return currentPage.route === route
	}
	
	uni.$on('updateZhuCe',function(info){
		showDialog.value = true
	})
	
	
	onShow(() => {
		console.log('需要每次都进入这里', wsData.value, registerWSData.value)
		if(registerWSData.value.length > 0){
			showDialog.value = true
		}
		// // socketData.forEach(d => onreward(d))
		// // return;
		// uni.$on('websocketMessage', (res) => {
		// 	console.log('监听的数据', res)
		// 	const reuslt = JSON.parse(res.data)
		// 	// && isCurrentPage('pages/tabbar/home/index')
		// 	if(reuslt && reuslt?.operateType === 34 ){// operateType:34(奖励)
		// 		console.log('进入奖励', reuslt)
		// 		onreward(reuslt)
		// 	}
		// 	// isCurrentPage('pagesA/addChildDevices/index')
		// 	if(reuslt && reuslt?.operateType === 35){// operateType:35(绑定设备--孩子端下载)
		// 		// 1.点击扫码下载孩子端，孩子手机扫二维码下载，点下载时会给家长端推一个品牌，根据品牌弹出视频（小米）
		// 		//2.孩子端下载，登录，扫码绑定之后拿到品牌，根据品牌弹出视频（荣耀、小米）
		// 		bindDeviceVideo(reuslt)
		// 	}
		// 	// && isCurrentPage('pagesA/addChildDevices/index')
		// 	if(reuslt && reuslt?.operateType === 36 ){// operateType:36(绑定设备--孩子端登录， 孩子端扫描绑定)
		// 		// 1.点击扫码下载孩子端，孩子手机扫二维码下载，点下载时会给家长端推一个品牌，根据品牌弹出视频（小米）
		// 		//2.孩子端下载，登录，扫码绑定之后拿到品牌，根据品牌弹出视频（荣耀、小米）
		// 		bindDeviceVideo(reuslt)
		// 	}
		// });
		
	})
	
	
	
</script>

<style lang="scss" scoped>
	.global-websocket-notice{
		
	}
</style>